<template>
	<!-- 企业视频 -->
	<div class="qiye">
		   <div class="onetou">
				<div class="xinqtext">
					 <h3>企业视频</h3>
					 <span>VIDEOS</span>
				</div>
				<view class="page" v-for="item in qiyeVideoList" v-if="item.hot==1">
					 <video class="video" id="demoVideo" :controls="false" :enable-progress-gesture="false" :src="item.video_src">
					 </video>
					 <h3>{{item.title}}</h3>
							 <text @click="deleteQiyeVideo(item)" class='iconter iconfont' size="30rpx">&#xe6c5;</text>
				</view>
				<div class="odiver">
					 <div v-for="(item,index) in qiyeVideoList" :key="index" v-if="item.hot==0">
						  <video class="video" id="demoVideo" :controls="false" :enable-progress-gesture="false" :src="item.video_src">
						  </video>
						  <h3>{{item.title}}</h3>
								  <text @click="deleteQiyeVideo(item)" class='iconter iconfont' size="30rpx">&#xe6c5;</text>
					 </div>
				</div>
		   </div>
		   <view class="button">
				<button class="uploadVideo" @click="uploadVideo">上传视频</button>   
		   </view>
	</div>
</template>

<script>
	import {
		 getQiyeVideo,
		 delQiyeVideo,
		 deitQiyeMsg,
		 getQiyeDetail
	} from "@/api/userminp.js"
	export default {
		data() {
			return {
				// 企业id
				qiyeId:null,
				// 企业视频列表
				qiyeVideoList:[],
				
			}
		},
		onShow(){
			if(uni.getStorageSync("QIYEID")){
				this.qiyeId=uni.getStorageSync("QIYEID")
				this.getQiyeVideoList()
			}
		},
		methods: {
			// 获取企业视频列表
			getQiyeVideoList(){
				  getQiyeVideo({	
					status:0,
					enterprise_id:this.qiyeId
				  }).then(res=>{
					this.qiyeVideoList=res.data.list
					console.log(this.qiyeVideoList)
				  })
			},
			// 删除企业视频
			deleteQiyeVideo(item){
				delQiyeVideo({
					id:item.id
				}).then(res=>{
					if(res.status==200){
						this.getQiyeVideoList()
						uni.showToast({
							 title: '删除视频成功',
							 icon: 'success',
							 duration: 1000
						})
					}
				})
			},
			// 上传企业视频
			uploadVideo(){
				  uni.navigateTo({
					url:"../upQiyeVideo/upQiyeVideo?id="+this.qiyeId
				  })
			},
		}
	}
</script>

<style lang="scss" scoped>
	page {
	    background-color: #fff;
		padding-bottom: 100rpx;
	}
	.qiye {
		padding: 32rpx 48rpx;
	     .onetou {
	          .xinqtext {
	               h3 {
	                    font-weight: 600;
	                    font-size: 32rpx;
	                    line-height: 40rpx;
	                    color: #161616;
	                    display: inline-block;
	                    vertical-align: middle;
	               }
	
	               span {
	                    margin-left: 16rpx;
	                    font-weight: 500;
	                    font-size: 24rpx;
	                    line-height: 40rpx;
	                    text-align: left;
	                    color: #e33c21;
	                    opacity: 0.2;
	                    vertical-align: middle;
	               }
	          }
	          .odiver{
	               display: grid;
	              grid-template-columns: 1fr 1fr;
	               column-gap: 16rpx;
						
	               >div{
	                    margin: 16rpx 0rpx;
	                    width: 320rpx;
	                    height: 336rpx;
	                    box-shadow: 0 4rpx 8rpx rgba(4, 11, 20, 0.05);
							 position: relative;
	                    video {
	                         width: 100%;
	                         height: 77%;
	                    }
	                    h3 {
	                         padding: 20rpx 24rpx;
	                         font-weight: 600;
	                         font-size: 28rpx;
	                         text-align: left;
	                         color: #161616;
	                    }
							 text{
								 font-size: 52rpx;
								 border-radius: 100%;
								 overflow: hidden;
								 background-color: #fff;
							 	position: absolute;
							 	top: -10rpx;
							 	right: -10rpx;
							 }
	               }
	          }
	          .page {
	               margin: 32rpx 0rpx;
	               width: 100%;
	               height: 400rpx;
	               box-shadow: 0 4rpx 8rpx rgba(4, 11, 20, 0.05);
						position: relative;
	
	               video {
	                    width: 100%;
	                    height: 77%;
	               }
	
	               h3 {
	                    padding: 20rpx 24rpx;
	                    font-weight: 600;
	                    font-size: 28rpx;
	                    text-align: left;
	                    color: #161616;
	               }
						text{
							 font-size: 52rpx;
							 border-radius: 100%;
							 overflow: hidden;
							 background-color: #fff;
							position: absolute;
							top: -10rpx;
							right: -10rpx;
						}
	          }
	     }
	}
	.button{
	  display: flex;
	  justify-content: center;
		.uploadVideo{
			background-color:#e33c21;
			color: white;
			width:50%;
			text-align:center;
			font-size: 28rpx;
			padding: 15rpx 20rpx;
		}
	}

</style>
